<!-- Modal -->
<div class="modal fade blur-text" id="message-left-nav" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content panel-default">
      <div class="modal-header panel-heading">
          <div class="with-icon">
                <i class="fa fa-comment"></i>
                <h4 class="h3 message-icon">Messages </h4>
          </div>
        <button type="button" class="close pull-right" data-dismiss="modal" aria-hidden="true">&times;</button>
      </div>
      <div class="modal-body grey">
        <p class="text-centered popup-top">You don't have any messages yet.<br>
        Search to <strong>to find people near you</strong>.</p>
        <button type="button" class="btn btn-success center-block popup-top btn-pop-up"><span class="glyphicon glyphicon-search"></span> Search</button>

        <div class="you-might-like-wrap">
          <p class="bold">You might like...</p>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <div class="clearfix"></div>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <a href="#"><img src="img/default-img.jpg" class="message-popup-image img-responsive img-popup img-thumbnail"></a>
          <button type="button" class="btn btn-default message-next-btn">Next</button>
        </div>

        <div class="clearfix"></div>
      </div>
    </div>
  </div>
</div>

